<template>
  <div class="news">
    <!-- 标题头部 -->
    <van-nav-bar
      title="新闻"
      left-text="返回"
      left-arrow
      fixed
      placeholder
      @click-left="onClickLeft"
    />

    <!-- 内容区域 -->
    <van-card
      :desc="item.detail"
      :title="item.title"
      :thumb="item.pic"
      v-for="(item, index) in dataArr"
      :key="index"
      @click="goDetail(item.id)"
    >
      <template #tags>
        <!-- <van-tag plain type="danger">2023.5.31.13</van-tag> -->
      </template>
      <template #footer>
        <div class="time">{{ new Date(item.time).toLocaleString() }}</div>
      </template>
    </van-card>
  </div>
</template>

<script>
import { Toast } from "vant"
export default {
  created() {
    this.getData()
  },

  data() {
    return {
      dataArr: [],
    }
  },

  methods: {
    onClickLeft() {
      this.$router.go(-1)
    },

    // 获取数据
    getData() {
      this.$api.news.getData().then((res) => {
        console.log(res)
        this.dataArr = res.data
      })
    },

    // 进入详情页
    goDetail(id) {
      console.log(id)
      // 路由传参
      this.$router.push({
        path: "/newsdetail",
        query: {
          id,
        },
      })
    },
  },
}
</script>

<style lang="less" scoped>
.time {
  color: rgba(7, 11, 14, 0.641);
}
</style>
